<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="textml; charset=utf-8" />
    <title>案例5</title>
    <style>
        span {
            color: #999;
        }
    </style>

</head>

<body>
    <div id="container">
        <button id="useless-btn">毫无用处的按钮<tton>
                <button id="add-btn">绑定click事件<tton>
                        <button id="remove-btn">解除绑定<tton>
    </div>
    <script type="text/javascript">
        var uselessBtn = document.getElementById('useless-btn');
        var addBtn = document.getElementById('add-btn');
        var removeBtn = document.getElementById('remove-btn');

        var EventUtil = {
            addHandler: function (element, eventType, handler) {
                if (element.addEventListener) {
                    element.addEventListener(eventType, handler, false);
                } else if (element.attachEvent) { // IE<=8
                    element.attachEvent('on' + eventType, handler);
                } else { // DOM0
                    element['on' + eventType] = handler;
                }
            },

            removeHandler: function (element, eventType, handler) {
                if (element.removeEventListener) {
                    element.removeEventListener(eventType, handler, false);
                } else if (element.detachEvent) { // IE<=8
                    element.detachEvent('on' + eventType, handler);
                } else { // DOM0
                    element['on' + eventType] = null;
                }
            },
            addtoadHandler: function (fnHandler) {
                this.addRandler(window, "load", fnHandler)
            }
        };

        function show() {
            alert('事件绑定成功');
        };
        function show1() {
            alert('事件未绑定');
        };
        EventUtil.addHandler(uselessBtn, 'click', function () {
            EventUtil.addtoadHandler(show1);
        });

        EventUtil.addHandler(addBtn, 'click', function () {
            EventUtil.addHandler(uselessBtn, 'click', show);
            uselessBtn.innerHTML = '我可以点击了';
        });

        EventUtil.addHandler(removeBtn, 'click', function () {
            EventUtil.removeHandler(uselessBtn, 'click', show);
            uselessBtn.innerHTML = '毫无用处的按钮';
        });
    </script>
</body>

<ml>